$(function () {
    console.log("js载入成功");
    //*************** 功能  渲染二级导航   ****************//
    //先将二级导航 隐藏
    $(function () {
        // $(".shadowBox").css({opacity:0})
        $(".shadowBox").hide()
    })


    // 鼠标滑到指定的一级导航里的li  渲染生成相对应的二级导航
    $(".navul .star").mouseenter(function () {

        //鼠标只有滑到指定的一级导航里面前五个 li 的时候才给 nav 添加背景颜色
        $(".nav").css({
            background: "#fff"
        })

        //鼠标只有滑到指定的一级导航里面前五个 li 的时候才让 二级导航 显示
        // $(".shadowBox").css({opacity:1});
        $(".shadowBox").show();

        //获取当前li的自定义属性名
        var name = $(this).attr("abc");
        console.log(name);
        //按照对应的属性名进行数据渲染
        searchNavListById({
            id: name
        }).then((result) => {
            var {
                status,
                detail,
                list
            } = result;
            if (status) {
                var html = "";
                list.forEach(function (item) {
                    var {
                        goodsId,
                        goodsName,
                        goodsPrice,
                        goodsImg
                    } = item;
                    html += ` <li>
                                <img src="${goodsImg}" alt="">
                                <p>${goodsName}</p>
                                <span>￥${goodsPrice}</span>
                            </li>`
                })
                $(".navList").html(html);
            }
        }).catch(err => {
            throw err;
        })
    })

    // $(".navul li").not($(".star")).css({background:"red"})
    //鼠标移到不是一级导航指定的前五个 li    就让 二级导航  和  背景颜色都消失
    $(".navul li").not($(".star")).mouseenter(function () {
        // $(".shadowBox").css({opacity:0});
        $(".shadowBox").hide()
        $(".nav").css({
            background: "none"
        })
    })

    //滑到二级导航的 li 给除了当前的 其他 li 添加蒙版
    $(document).on("mouseenter", ".navList li", function () {
            $(this).removeClass('active').siblings().addClass("active");
        })
        .on("mouseleave", ".nav", function () {
            $(this).css({
                background: "none"
            });
            $(".shadowBox").hide()
        })


    //先让 imgBox 隐藏
    $(function () {
        $(".imgBox").hide()
    })


    //鼠标滑上 app的li nav添加背景颜色 imgBox出现
    $(document).on("mouseenter", ".navul .app", function () {
        $(".nav").css({
            background: "#fff"
        });
        $(".imgBox").show()
    }).on("mouseleave", ".navul .app", function () {
        $(".imgBox").hide();
        $(".nav").css({
            background: "none"
        });
    })


    //点击商品 跳转商品列表页
    $(document).on("click", ".goLists", function () {
        location.href = "GoodList.html";
    }).on("click", ".star", function () {
        location.href = "GoodList.html";
    })


    //************ 用户名盒子的显示 ******//
    $(function () {
        $(".u_box").hide()
    })

    $(document).on("mouseenter", ".user", function () {
        $(".u_box").show()
    }).on("mouseleave", ".u_box", function () {
        $(".u_box").hide()
    })

    // **************  标识用户身份 ************************* //
    var cookie = document.cookie;
    if (cookie) {
        var user = getCookie("lgc");
        if (user) {
            $(".header_nav .u_box .logli").html(`<a href="jacvascript:;">欢迎,${user}</a>`);
            $(".header_nav .u_box .registli").html(`<a href="./index1.html">退出登录</a>`);
            $(".header_nav .u_box .registli").click(function () {
                setCookie("lgc", "", -1);
                location.reload();
            })
        }
    } else {
        var user = "";
    }

    // *********** 购物车 ***************** //
    if (user) {
        $(".spCart").click(function () {
            location.href = "../html/shoppingCar.html"
        })
    } else {
        $(".spCart").click(function () {
            location.href = "../html/login.html"
        })
    }









})